<template>
<div id="app">
    <keep-alive :include="keepAliveView">
        <router-view></router-view>
    </keep-alive>
</div>
</template>
<script>
export default {
    name:'App',
    data(){
        return {
            keepAliveView:'',  //需要缓存的组件，逗号分隔
        };
    },
    created(){
        this.getKeepAliveView();
    },
    methods:{
        getKeepAliveView(){
            let list = this.$router.options.routes.filter(item=>{
                if(!item.meta) return false;
                return item.meta.keepAlive;
            }).map(item=>{
                return item.name;
            });
            this.keepAliveView = "," + list.join(",");
        },
    },
}
</script>
<style lang="scss">
#app {
    font-family: Avenir, Helvetica, Arial, sans-serif;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-align: left;
    color: #2c3e50;
}
</style>
